<template>
	<view style="height: 100vh;overflow: hidden;">
		
		<view class="bg">
			<image src="../../../static/msj/组 6.png"></image>
			
			<!-- <image src="@/resource/login/login-bg.png"></image> -->
		</view>
		<view style="color: white;font-size: 22px;position: relative;top: -180px;text-align: center;">
			<span>欢迎来到车联网服务平台商家端</span>
		</view>
		<view class="car">
			<image src="../../../static/msj/组 6(1).png"></image>
			
		</view>
		<view class="content">
			<u-form :model="form" ref="uForm">
				<u-form-item><u-input v-model="form.phone" placeholder="手机号登陆"
						style="border-top: none;border-right: none;border-left: none;border-radius: 0;" /></u-form-item>
				<u-form-item><u-input v-model="form.verify" placeholder="请输入验证码"
						style="border-top: none;border-right: none;border-left: none;border-radius: 0;" />
					<u-button size="small" style="border-radius: 22px;" slot="right" type="primary"
						@click="getCode">获取验证码</u-button></u-form-item>
			</u-form>
			<span style="color: #3183FB;" @click="toRegister()">立即注册></span>
			<u-button shape="circle" type="primary" style="margin-top: 20px;" @click="toIndex">登录</u-button>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				form: {
					phone: '',
					verify: ''
				},
				tips: '',
				// refCode: null,
				seconds: 60,
			}
		},
		onReady() {
			// 注意这里不能将一个组件赋值给data的一个变量，否则在微信小程序会
			// 造成循环引用而报错，如果你想这样做，请在非data中定义refCode变量
			// this.refCode = this.$refs.uCode;
		},
		methods: {
			toRegister() {
				uni.navigateTo({
					url:'/pages/msj/register/register?city=请选择区县',
					animationType: 'pop-in',
					animationDuration: 200
				});
			},
			toIndex(){
				uni.reLaunch({
					url: '/pages/msj/home/home',
					animationType: 'pop-in',
					animationDuration: 200
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.wrap {
		padding: 24rpx;
	}

	.bg image {
		width: 100%;
	}

	.car {
		position: relative;
		top: -152px;
		left: 116px;
		z-index: 2;
	}

	.content {
		position: relative;
		width: 100%;
		top: -200px;
		height: 100vh;
		border-radius: 28px;
		background-color: white;
		padding: 60px 60px;
		box-sizing: border-box;
	}

	.car image {
		width: 42%;
		height: 226rpx;
	}
</style>